<template>
	<view class="container" v-if="zfbInfo!=null">
		<!-- 提现至支付宝 -->
		<view class="t-box">
			<view class="text1">提现至：{{zfbInfo.aliAccount}}</view>
			<view class="t-zhifubao">
				<image style="width: 36rpx;" src="../../static/pay/zhifubao.png" mode="widthFix"></image>
				<text class="text2" @click="upAli">修改支付宝</text>
			</view>
		</view>
		<!-- 提现金额 -->
		<view class="text1">提现金额</view>
		<view class="t-input">
			<text style="font-size: 36rpx;">￥</text>
			<input type="number" @input="inputmoney" v-model="moment" placeholder="至少100且为100的倍数"/>
		</view>
		<view class="t-all">
			<text class="text3">提现手续费5%</text>
			<text class="text3" v-if="flag==true">,扣除{{sxf}}元手续费，实际到账{{dz}}元</text>
		</view>
		<view class="t-all">
			<text class="text3">当前余额{{yu}},</text>
			<text class="text4" @click="allApply">全部提现</text>
		</view>
		<view class="t-apply" :class="{'t-apply-moment':flag}" @click="getApply">申请提现</view>
	</view>
</template>

<script>
	import {huixianzfb} from"../../api/login.js"
	import {userWithdrawal} from "../../api/user.js"
	export default {
		data(){
			return{
				moment:'',
				flag:false,
				zfbInfo:null,
				yu:'',
				sxf:null,
				dz:null,
				type:1
			}
		},
		onLoad(e) {
			this.yu=uni.getStorageSync("yunbi").cloudCoinNum
		},
		onShow() {
			if(uni.getStorageSync("yunbi").gradeName==''|| uni.getStorageSync("yunbi").gradeName==undefined){
				this.msg('非VIP会员不可提现','none')
				setTimeout(()=>{
					uni.navigateBack({
						delta:1
					})
				},1500)
			}else{
				this.getZfb()
			}
		},
		onNavigationBarButtonTap(){
			uni.navigateTo({
				url:"/pages/transfer/zhangdan"
			})
		},
		watch:{
			moment: {
				handler(val, oldVal){
					this.sxf=null
					this.dz=null
					this.moment=val.replace(/\b(0+)/gi,"")
					if(parseInt(this.moment)>0){
						this.sxf=Math.round(0.05*parseInt(this.moment))
						this.dz=parseInt(this.moment)-this.sxf
					}
				},
				deep:true
			}
		},
		methods:{
			//修改支付宝
			upAli(){
				uni.navigateTo({
					url:'bindaccount?type=1'//type=1 修改支付宝
				})
			},
			inputmoney(){
				if(this.moment.trim()!=""&&this.moment>=100&&parseInt(this.moment)%100==0){
					if(parseInt(this.moment)<=0){
						this.moment=0
						return
					}
					this.flag=true;
				}else{
					this.flag=false;
				}
			},
			// 获取支付宝信息
			async getZfb(){
				let res=await this.get(huixianzfb)
				this.zfbInfo=res.data
				if(res.data==null){
					uni.showModal({
					    title: '提示',
					    content: '提现功能需要先绑定支付宝，是否绑定',
					    success:(res)=> {
					        if (res.confirm) {
								uni.navigateTo({
									url:"/pages/transfer/bindaccount?type=0"
								})
					        } else if (res.cancel) {
								this.msg("提现功能将不可用","none")
					        }
					    }
					});
				}
			},
			getApply(){
				if(this.flag==false){
					this.msg("提现金额至少100",'none')
					return
				}else{
					if(this.moment>this.yu){
						this.msg("余额不足","none")
					}else{
						// payType 1支付宝 2银行卡
						this.showMd("是否确认提现",()=>{
							this.post(userWithdrawal,{withdrawalMoney:this.moment,payType:1}).then(res=>{
								console.log(res)
								this.msg("提现成功","none")
								setTimeout(()=>{
									uni.navigateBack({
										delta:1
									})
								},1500)
							})
						})
					}
					
				}
			},
			allApply(){
				this.moment=this.yu
				if(this.moment>100){
					this.moment=this.yu
					this.inputmoney()
					this.flag=true;
				}
			}
		}
	}
</script>

<style>
	.container{
		padding: 0 30rpx;
	}
	
	.t-apply{
		width: 460rpx;
		height: 88rpx;
		background: #F0812D;
		opacity: 0.3;
		border-radius: 8rpx;
		margin: 68rpx auto;
		font-size: 30rpx;
		font-weight: 400;
		line-height: 88rpx;
		color: #FFFFFF;
		text-align: center;
	}
	.t-apply-moment{
		background: #F0812D;
		opacity: 1;
	}
	.text4{
		font-size: 26rpx;
		font-weight: 600;
		color: #000000;
		margin-left: 20rpx;
	}
	.text3{
		font-size: 26rpx;
		font-weight: 400;
		color: #999999;
	}
	.t-all{
		margin-top: 16rpx;
	}
	.t-input{
		margin-top: 30rpx;
		display: flex;
		align-items: center;
		border-bottom: 1px solid #D5D5D5;
		padding-bottom: 24rpx;
	}
	.text2{
		font-size: 26rpx;
		font-weight: 500;
		color: #333333;
		margin-left: 15rpx;
	}
	.t-zhifubao{
		display: flex;
		align-items: center;
	}
	.text1{
		font-size: 26rpx;
		font-weight: 300;
		color: #999999;
	}
	.t-box{
		width: 690rpx;
		margin: 63rpx auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
</style>
